<div class="boxed-group">
  <h3>{{ "settings.menu.SERVICE_GROUP_TAG" | translate }}</h3>
  <div class="boxed-group-inner clearfix">
    <div class="group_header">
      {{ "application.grouping.SERVICE_GROUP_MANAGER_TAG" | translate }}
      <div class="move">
        <span class="l">{{ "application.grouping.MOVE_TO" | translate }}</span>
        <div class="dropdown">
          <button class="btn btn-default dropdown-toggle" type="button" id="menu1" data-toggle="dropdown">{{ "application.grouping.SELECT_GROUP" | translate }}
            <span class="caret"></span>
          </button>
          <ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
            <li ng-repeat="group in team.group_list | filter: switchGroupListFilter | orderBy: 'createtime' " ng-click="switch_group(group, $index)">{{handle_group_name(group.group_name, 5)}}</li>
          </ul>
        </div>
      </div>
    </div>
    <div class="con">
      <div class="le">
        <p id="default_highlight"><a ng-click="get_all_service()">{{ "application.grouping.ALL_SERVICE_USER" | translate }}（{{team.service_user_list.length}}）</a></p>
        <ul>
          <li ng-repeat="group in team.group_list | orderBy: 'createtime' " id="colored_group_{{$index}}" class="not_exist">
            
            <a ng-click="checkout_to_group( group, $index )" >{{handle_group_name(group.group_name, 5)}}</a>
            <i class="glyphicon glyphicon-pencil dd" ng-click="show_update_group_modal( group, $index )" ng-show="isGroupEditable(group)" ></i>
            <i class="glyphicon glyphicon-trash dd" ng-click="remove_group( group, $index )" ng-show="isGroupEditable(group)" ></i>
            
          </li>
          <!-- <li id="no_group_list" class="not_exist"><a ng-click="checkout_no_group_user()" >未分组（{{team.no_group_info.user_list.length}}）</a></li> -->
        </ul>
        <span  ng-click="show_create_group_modal()"><i class="glyphicon glyphicon-plus"></i>{{ "application.grouping.NEW_GROUP" | translate }}</span>
      </div>
      <div class="ri">
        <table class="table">
          <thead>
            <tr>
              <th><a ng-click="checkAll()" ng-show="showCheckAllColumn" >{{ "application.grouping.SELECT_ALL" | translate }}</a></th>
              <th>{{ "application.grouping.LOGIN_EMAIL" | translate }}</th>
              <th>{{ "application.grouping.ROLE" | translate }}</th>
              <th>{{ "application.grouping.GROUP_IN" | translate }}</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="user in team.current_list.user_list | orderBy: 'createtime' ">
              <td><input type="checkbox" id="current_list_{{$index}}" ng-click="select_user($index)" ng-show="showCheckAllColumn" /></td>
              <td>{{user.user_email}}</td>
              <td>{{show_identify(user.user_email)}}</td>
              <td>{{handle_group_name(user.user_group_name, 3)}}</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
  <h3 style="margin-top:40px;">{{ "application.grouping.GROUP_MODE_CONFIG" | translate }}</h3>
  <div class="boxed-group-inner clearfix" style="max-height:300px;overflow-x:scroll">
    <table class="table" style="margin-bottom:0px !important">
      <thead>
        <tr>
          <th class="one_five">{{ "application.grouping.IS_SHOW_GROUP" | translate }}</th>
          <!-- <th class="one_five">显示顺序</th> -->
          <th class="one_five">{{ "application.grouping.GROUP_NAME" | translate }}</th>
          <!-- <th class="two_five">服务时间</th> -->
          <th class="three_zero">{{ "application.grouping.DISPATCH_WAY" | translate }}</th>
        </tr>
      </thead>
      <tbody>
        <tr class="group-config" ng-repeat="group in team.group_list | filter : groupListFilter |orderBy:'createtime' ">
          <td><input type="checkbox" ng-model="group.checked" ng-click="modify_group($index)"/></td>
          <!-- <td><input type="text" class="five_zero" ng-model="group.group_visible_order_for_ppcom" ng-change="modify_group($index)" ng-model-options="{ updateOn: 'blur' }" /></td> -->
          <td class="top">{{handle_group_name(group.group_name, 3)}}</td>
          <!-- <td><input type="text" name="start_time_{{$index}}" class="two_five" ng-model="group.start_time" ng-change="modify_group($index)" ng-model-options="{ updateOn: 'blur' }">点 至<input type="text" name="end_time_{{$index}}" class="two_five" ng-model="group.end_time" ng-change="modify_group($index)" ng-model-options="{ updateOn: 'blur' }">点</td> -->
          <td>
            <select ng-model="group.group_route_algorithm" ng-change="modify_group($index)">
              <option value="broadcast">新增访客平均分流</option>
              <option value="smart">优先分配给“发送总消息”最少客服</option>
              <option value="load">优先分配给“累积总消息数”最少客服</option>
            </select>
          </td>
        </tr>
      </tbody>
    </table>
     <p class="button-group" style="display:none;"> 
       <a ui-sref="app.glance" target="_blank" href="#/app/glance"><span class="union left">效果预览</span></a> 
       <span class="union right" ng-click="config_group()">提交</span> 
     </p> 
  </div>
</div>
<div class="modal fade" id="create_group" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document" style="top: 150px;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">
          <strong>{{ "application.grouping.CREATE_GROUP" | translate }}</strong>
        </h4>
      </div>
      <div class="modal-body">
        <div>
          <span class="modal-body-email-h">{{ "application.grouping.GROUP_NAME" | translate }}:</span>
          <input type="text" class="modal-body-email-b" ng-model="new_group_name" tabindex="1" value="new_group_name" name="new_group_name" maxlength="15"/>
          <span class="modal-body-email-bb">*</span>
          <span class="modal-body-email-note" id="created_group_name"> {{ create_group_error.name_error }} </span>
        </div>
        <div style="margin-top:10px;">
          <span class="modal-body-email-h">{{ "application.grouping.GROUP_DESC" | translate }}:</span>
          <input type="text" class="modal-body-email-b" ng-model="new_group_desc" tabindex="2" value="new_group_desc" name="new_group_name" maxlength="15"/>
          <span class="modal-body-email-bb">*</span>
          <span class="modal-body-email-note" id="created_group_desc"> {{ create_group_error.desc_error }} </span>
        </div>
      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-primary" ng-click="create_group()" tabindex="5" >{{ "application.grouping.CREATE" | translate }}</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="update_group" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document" style="top: 150px;">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">
          <strong>{{ "application.grouping.MODIFY_GROUP" | translate }}</strong>
        </h4>
      </div>
      <div class="modal-body">
        <div>
          <span class="modal-body-email-h">{{ "application.grouping.GROUP_NAME" | translate }}:</span>
          <input type="text" class="modal-body-email-b" tabindex="1" ng-model="selected_group.group_name"/>
          <span class="modal-body-email-bb">*</span>
          <span class="modal-body-email-note" id="modify_group_name"> {{ update_group_error.name_error }} </span>
        </div>
        <div style="margin-top:10px;">
          <span class="modal-body-email-h">{{ "application.grouping.GROUP_DESC" | translate }}:</span>
          <input type="text" class="modal-body-email-b" ng-model="selected_group.group_desc" tabindex="2" maxlength="15"/>
          <span class="modal-body-email-bb">*</span>
          <span class="modal-body-email-note" id="modify_group_desc"> {{ update_group_error.desc_error }} </span>
        </div>
      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-primary" ng-click="update_group()" tabindex="5">{{ "application.grouping.SAVE" | translate }}</button>
      </div>
    </div>
  </div>
</div>
<script>
  $(function () { $("[data-toggle='tooltip']").tooltip(); });
</script>
